<!--
 * @description  : 市管-无证电子烟信息采集-关联企业选择
 * @descriptionDetail: 市管-无证电子烟信息采集-关联企业选择
 * @copyright    : 浙江烟草
 * @author       : sy
 * @create       : 2023-07-03 14:57:44
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar
      :is-white="false"
      :title="navTitle"
      :custom-back="goBack"
      style="z-index: 99999"
    >
      <view class="nav-right-icon">
        <view @tap="handlerSure">
          确定
        </view>
      </view>
    </theme-navbar>
    <!-- #endif -->
    <view>
      <u-search
        class="search-space"
        shape="round"
        :clearabled="true"
        :showAction="true"
        actionText="确定"
        :animation="true"
        placeholder="企业名称、法定代表人、企业住所"
        v-model="searchData.keyWord"
        @custom="handlerSearch"
      ></u-search> 
      <u-dropdown class="u-p-r-30" ref="searchDropDown" @open="handlerOpen" @close="handlerClose">
        <u-dropdown-item :title="curOrgName" :options="[]" v-model="searchData.orgUuid" @change="handlerChangeItem"></u-dropdown-item>		
        <u-dropdown-item title="业务类型">
          <view class="slot-ts">
            <u-cell-group :border="false">
              <u-cell-item :title="ix.bcbName" :arrow="false" v-for="ix in taskSourceOptions" :key="ix.bcbId" @click="selectTaskSubject(ix)">
                <u-icon v-if="ix.checked" slot="right-icon" size="40" :color="$theme.u_type_primary" name="checkbox-mark"></u-icon>
              </u-cell-item>
            </u-cell-group>
          </view>
        </u-dropdown-item>
      </u-dropdown>
      <u-gap class="u-gap-sty" :height="$theme.cm_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
    </view>
    <view class="content u-page u-p-t-30">
      <mescroll-list
        :i="0"
        :index="0"
        :height="getListViewHeight()"
        :load-data="loadData"
        :initLoad="false"
        ref="mescrollItem0"
      >
        <view slot-scope="d">
          <u-row style="border-bottom: 1px solid #e5e5e5; padding: 5px 0px;" @tap="handlerSelectItem(d.data)">
            <u-col span="10">
              <client-item :client="d.data"></client-item>
            </u-col>
            <u-col span="2" style="text-align:right;">
              <u-icon
                name="checkbox-mark"
                :color="$theme.u_type_primary"
                size="38"
                style="margin-right: 10px;"
                v-if="selectedUids.includes(d.data.entUuid)"
              ></u-icon>
            </u-col>
          </u-row>
        </view>
      </mescroll-list>
    </view>
    <view class="space-content"></view>
    <!-- 组织机构选择 -->
    <u-popup mode="bottom" height="80%" v-model="orgSelectShow" @close="handlerCloseOrg">
      <org-select :parentUuid="parentUuid" :cleanParentOrg="true" :isHybrid="true" limitNodeType="all" treeType="zm-all" @choose="handlerChooseOrg"></org-select>
    </u-popup>
  </view>
</template>

<script>
import MescrollList from "@/components/mescroll_list.vue";
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import checkService from "@/service/check/check.service"
import {dateUtils,} from "@/common/util"
import ClientItem from './components/client-item.vue';
import {M_TASK_SOURCE,} from "@/service/check/mapping/enum.js";
import OrgSelect from "@/components/org-select.vue"

export default {
  components: {
    MescrollList,
    ClientItem,
    OrgSelect,
  },
  mixins: [MescrollMoreMixin,],
  data() {
    return {
      M_TASK_SOURCE,
      user: this.$store.state.userInfo,
      keyword: "",
      orgSelectShow: false,
      selectedUids: [],     // 选中项的ids
      selectedItems: [],     // 选中项
      searchData: {   // 查询参数
        keyWord: "",  // 模糊搜索关键字
        orgUuid: "",
        entType: "",
      },
      isSingle: false, // 是否单选，默认多选
      isDisabled:false,
      isRelRetailer:false, // 是否是关联经营户
      newTitle:'',
      parentUuid:"",
      curOrgName: "组织机构",
      AcceptanceShow: false,
      taskSourceOptions:[],
      entUuid:'',
    };
  },
  onLoad(opt) {
    // 是否单选
    this.isSingle = opt.isSingle;
    // 是否是关联经营户
    this.isRelRetailer = opt.isRelRetailer; 
    this.newTitle = opt.title ? opt.title : '选择关联企业';
    this.entUuid = opt.entUuid;
    // this.searchData.orgUuid = this.user.user.depart.orgUuid;
    this.parentUuid = this.user.user.depart.orgUuid;
    this.curOrgName = this.user.user.depart.orgName;
  },
  created () {
    this.taskSourceOptions = this.$store.state.dicts['L_UNLIC_ECIG_ENT_ENT_TYPE']; 
  },
  mounted() {
    this.updateTitle();
  },
  methods: {
    setRightBtns() {
      // 设置右侧标题
      // #ifdef H5-DINGDING
      // 先放开右侧标题
      this.$deviceApi.setRight("确定", () => {
        // 添加日计划操作
        this.handlerSure();
      }, true, true);
      // #endif
    },
    getListViewHeight() {
      let p = (this.$u.sys().windowHeight - 44 - uni.upx2px(90)  - this.$u.sys().statusBarHeight) + "px";
      // #ifdef H5-DINGDING
      p = (this.$u.sys().windowHeight - uni.upx2px(90)  - this.$u.sys().statusBarHeight) + "px";
      // #endif
      return p;
    },
    selectTaskSubject(ix){
      for(let i = 0; i < this.taskSourceOptions.length; i ++){
        if(this.taskSourceOptions[i].bcbId == ix.bcbId) {
          this.taskSourceOptions[i].checked = !this.taskSourceOptions[i].checked;
          this.searchData.entType = ix.bcbCode;
          break;
        }else{
          this.taskSourceOptions[i].checked = false;
          this.searchData.entType = '';
        }
      }
      this.taskSourceOptions = [... this.taskSourceOptions,]
      this.$refs.searchDropDown.highlight();
      this.$refs.searchDropDown.close();
      this.handlerSearch();
    },
    handlerSearch() {
      let mescroll = this.getMescroll(0);
      mescroll && mescroll.triggerDownScroll();
    },
    updateTitle(){
      this.$deviceApi.setTitle && this.$deviceApi.setTitle(this.newTitle);
      this.navTitle = this.newTitle;
      this.$forceUpdate();
    },
    // 选中
    handlerSelectItem(item) {
      if (this.isSingle) {
        this.selectedUids = [item.entUuid,];
        this.selectedItems = [item,];
        return;
      }
      if (this.selectedUids.includes(item.entUuid)) {
        this.selectedItems = this.selectedItems.filter(it => it.entUuid != item.entUuid);
      } else {
        this.selectedItems.push(item);
      }
      this.selectedUids = [];
      this.selectedItems.forEach(it => this.selectedUids.push(it.entUuid));
    },
    // 选择搜索条件项
    handlerChangeItem() {
      console.log(this.searchData);
      this.handlerSearch();
    },
    handlerOpen(idx) {
      // 组织机构 0
      idx == 0 && (this.orgSelectShow = true);
      this.$refs.searchDropDown.highlight();
    },
    handlerClose(idx) {
      this.orgSelectShow = false;
      this.$refs.searchDropDown.highlight(idx);
    },
    handlerChooseOrg(orgs) {
      if (orgs.length == 0) {
        this.$u.toast("请选择组织机构");
        return;
      }
      this.searchData.orgUuid = orgs[0].id;
      this.curOrgName = orgs[0].name;
      this.$refs.searchDropDown.close();      
      this.handlerSearch();
    },
    handlerCloseOrg() {
      this.$refs.searchDropDown.close();      
    },
    // 列表查询数据
    loadData(page) {
      return new Promise((resolve, reject) => {
        const parmas = {
          page: page.num, 
          limit: page.size,
          ...this.searchData,
        };
        checkService.findUnlicEcigEntList(parmas).then(res => {
          if(res.success){
            // 过滤自己的企业
            let list = res.data.filter((item) => {
              return item.entUuid != this.entUuid;
            });
            console.log(list);
            resolve({
              count: list.length,
              data:list,
            });            
          }else{
            this.$u.toast(res.msg);
            resolve({
              count: 0,
              data:[],
            });
          }
        }).catch(err => {
          this.$u.toast(err);
          resolve({
            count: 0,
            data:[],
          });
        });
      });
    },
    // 确定
    handlerSure() {
      // 单选
      if(this.isSingle && !this.$u.test.isEmpty(this.selectedItems)){
      // 选择关联企业
        if(this.isRelRetailer){
          this.backPrev({
            paramKey: 'relEntList',
            param : this.selectedItems,
          });
          this.selectedUids = this.selectedItems = [];
        }
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.page{
	padding:0;
}
.slot-content {
  background-color: #FFFFFF;
  padding:32rpx 32rpx;
  .item-box {
    margin-bottom: 32rpx;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
   }
}
.txt-sty{
  line-height: 60rpx;
  padding: 0 10px;
}
.search-space{
	padding: $cm-search-padding-row $cm-search-padding-column;
	padding-bottom: 6px;
}
.u-gap-sty{
	position: relative;
}
.good-popup-lay {
		padding: $cm-content-paddng-row;
		width: 100%;
		height: 100%;

		&__title {
			font-size: 36rpx;
			font-weight: 600;
			color: $u-main-color;
			margin: 10rpx 0;
			text-align: center;
			width: 100%;
		}

		&__btns {
			width: 100%;
			margin-top: 24rpx;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			uni-button {
				flex: 0.28;
			}
		}
	}
</style>
